<!--
 * @Author: WangShuai 1830773767@qq.com
 * @Date: 2025-06-01 08:52:55
 * @LastEditors: WangShuai 1830773767@qq.com
 * @LastEditTime: 2025-06-01 10:40:05
 * @FilePath: \guanggu_traffic\src\views\traffic\components\SetNotice\SetNotice.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
	<el-menu-item index="5">
		<span @click="handleNotice">发布公告</span>
        <NoticeDialog v-model="dialogVisible" :resultData="resultData"></NoticeDialog>
	</el-menu-item>
</template>

<script setup>
import { ref } from 'vue'
import { onMounted, getCurrentInstance } from 'vue'
import { Query } from '@/api/mapgis-api/Query'
import { setAreaStyle } from '@/api/ol-api/setStyle'
import { createDraw } from '@/api/ol-api/createDraw'
import { FeatureToJson } from '@/api/ol-api/index'
import * as turf from '@turf/turf'
import NoticeDialog from './NoticeDialog.vue'
const { proxy } = getCurrentInstance()
let resultData = ref([]) //保存公告数据
let dialogVisible = ref(false)//是否显示公告弹窗
let map = null
let service = {
	docName: import.meta.env.VITE_MAPGIS_DOC_NAME,
	layerId: 0,
}
onMounted(() => {
	//获取地图实例
	map = proxy.$map
	map.addLayer(drawLayer)
})
//画笔图层
//数据源
let drawSource = new ol.source.Vector({})
let drawLayer = new ol.layer.Vector({
	source: drawSource,
	style: setAreaStyle({}),
})
//创建画笔实例
let draw = createDraw({
	type: 'LineString',
	source: drawSource,
})
draw.on('drawend', async (e) => {
	//移除画笔
	map.removeInteraction(draw)
	//获取画笔的几何信息
	const geometry = e.feature.getGeometry()
	const coordinates = geometry.getCoordinates()
	const line = turf.lineString(coordinates)
	console.log(line)
	//创建缓冲区 第一个参数缓冲区半径 第二个参数的缓冲距离(单位公里)
	const bufferedLine = turf.buffer(line, 0.15)
	// console.log("bufferLine",bufferedLine);
	//添加到地图
	const feature = new ol.Feature({
		geometry: new ol.geom.Polygon(bufferedLine.geometry.coordinates),
	})
	drawSource.addFeature(feature)
	//查询居民区
	const features = await Query.queryByLayerId(service)
	const buildingsGeos = FeatureToJson(features)
	// console.log("查询居民区",buildingsGeos);
	//叠加分析
	const intersects = buildingsGeos.features.filter((building) => {
		const intersect = turf.booleanOverlap(building, bufferedLine)
		// console.log("object",intersect);
		return intersect
	})
	// console.log('//叠加分析', intersects)
	//更新公告显示数
	resultData.value = intersects.map((feature) => {
		return {
			name: feature.properties.values_.name,
			phone: feature.properties.values_.tel,
		}
	})
	//显示公告弹窗
    dialogVisible.value = true;
	//清空画笔
	drawSource.clear()
})
//发布公告事件回调(激活画笔)
const handleNotice = () => {
	map.addInteraction(draw)
}
</script>

<style lang="scss" scoped></style>
